/* 导航修正，否则不显示 */
.main-nav--opened .main-nav__item{
    opacity: 1;
}

/* shouye */
.blue {
    color: #004d7b;
}

.weight {
    font-weight: bold;
}

.m-t20 {
    margin-top: 20px;
}

.daigong {

    .title {
        background-color: #004d7b;
        color: #fff;
        line-height: 2.5;
        text-indent: 20px;
    }

    .item-list {

        margin-top: 20px;

        display: flex;
        flex-wrap: wrap;

        .item {

            width: 50%;
            padding: 20px 50px;
            box-sizing: border-box;

            .zhutu {
                img {
                    width: 100%;
                }
            }


            .biaoqian-label {

                display: flex;
                align-items: center;

                position: relative;
                width: 80%;

                background-color: #004d7b;
                margin: 0 auto;
                top: -60px;
                color: #fff;

                padding: 10px;

                .biaoqian {

                    width: 80px;
                    flex: none;

                    img {
                        width: 100%;
                    }
                }

                .label {

                    padding-left: 20px;

                    h3 {
                        margin: 0;
                        padding: 0;
                        // font-size: 18px;

                        font-size: 17px;
                        line-height: 1;
                        margin-bottom: 8px;
                    }

                    p {
                        margin: 0;
                        padding: 0;
                        font-size: 14px;
                    }
                }


            }

        }
    }
}

.npi{
    margin-top:0;
    margin-bottom:0;
}
.product {

    .title {
        background-color: #004d7b;
        color: #fff;
        line-height: 2.5;
        text-indent: 20px;
    }

    .liebiao {

        .item {

            display: flex;
            align-items: center;

            &:hover {
                .photo {
                    .small {
                        display: none;
                    }

                    .big {
                        display: inline-block;
                        box-shadow: 2px 2px 5px #cdcdcd;
                    }
                }

                .word {

                    .label {

                        &::before {
                            content: " ";
                            display: block;
                            position: absolute;
                            top: 8px;
                            left: -20px;
                            width: 0;
                            height: 0;
                            border-bottom: 8px solid transparent;
                            border-top: 8px solid transparent;
                            border-right: 16px solid rgb(166, 177, 2);
                        }
                    }
                }

            }

            .photo {

                flex: 1;


                width: 50%;
                text-align: right;

                .small {
                    display: inline-block;
                    max-width: 100%;

                }

                .big {
                    max-width: 100%;
                    display: none;
                }


            }

            .word {

                width: 50%;
                flex: 1;
                padding: 0 30px;
                box-sizing: border-box;

                .label {

                    font-weight: bold;
                    line-height: 2;
                    font-size: 16px;
                    position: relative;


                }

                .description {
                    font-size: 14px;
                    line-height: 1.5;
                }
            }
        }

    }

}

.numbers__items {

    .numbers__item {
        .numbers__text {

            .text {
                // font-weight:bold;

            }

            .weight {
                font-size: 18px;
            }
        }
    }
}

.solutions-item-title {
    font-size: 20px;
}

.solution-tail {

    .img-txt {

        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;

        .img {
            width: 50%;
            text-align: center;

            img {
                max-height: 380px;

            }

        }

        .description {
            width: 50%;

            h3 {
                font-size: 20px;
            }

            p {}
        }

    }
}

@media screen and (max-width: 975px) {

    .daigong {

        .item-list {

            .item {
                width: 100%;
                padding: 0;

                .biaoqian-label {
                    top: 0;
                    width: 100%;
                }
            }
        }
    }


}

@media only screen and (max-width: 768px) {

    .head-txt-img{
        flex-wrap: wrap;
        .head-txt { 
            width: 100%;
        }

        .img{
            width: 100%;
            img{
                width: 100%;
            }
        }

    }
    .solution-tail {

        .img-txt {

            .img {
                width: 100%;
            }

            .description {
                width: 100%;
            }
        }

    }
}


.slide-image {

    width: 100%;
    height: 100%;
    object-fit: cover;
    /*图片自适应容器，保持比例*/

}

/* OEM */
.title-field {

    position:relative;

    top:-4rem;
    z-index:10;
    background-color: #004d7b;
    text-align: center;
    color: #fff;

    padding: 20px;

    .title-icon {
        img {
            height: 8rem;
        }


    }

    .name {

        font-size: 3rem;
        font-weight: bold;
    }



}

.feature {

    margin: 5rem auto;
    border: solid 2px #004d7b;

    width: 86%;
    padding: 2rem;
    line-height: 1.5;


}

.description {

    p {}

}

.changjuzi {

    p {
        text-align: left;
        font-size: 1.5rem;
        line-height: 1.5;
        padding: 10px 0 10px 20px;
    }
}



@media screen and (max-width: 960px){

    .title-field{

        top:0;
    }
    
}

/* agency  and solutions */

.head-txt-img {

    display: flex;
    flex-direction: row;
    align-items: center;

    border-bottom: solid 20px #004d7b;

    .head-txt {}

    .img {

        // width:400%;
        img {
            max-width: 550px;
        }

    }
}

.tubiao{
    margin-top:5rem;
    display: flex;

    .item{
        width:25%;
        text-align: center;
        img{

            max-width:80px;

            width:100%;
        }
    }
}

.zhibiao {
    margin-top:1rem!important;
    table{
        width: 100%;
        text-align: center;
        tr{

            td{
                width:25%;
            }
        }
    }
    .con {
        font-size: 14px;
        line-height: 1.5;
    }


    .head {

        background-color: #004d7b;
        color: #fff;
        text-align: center;
        font-weight: bold;
        font-size: 16px;
        line-height: 1.5;
    }

}

.features {

    h3 {
        border-bottom: solid 1px;
        line-height: 3;
        font-size: 2.2rem;
        margin-bottom: 0;
    }

    p {
        line-height: 1.5;
    }
}


.duijiaoxian {
    position: relative;

    display:flex;
    justify-content:space-between;
    &::before {
        position: absolute;
        top:50%;
        left:0;
        content: " ";
        display: block;
        width: 100%;
        padding:0 10px ;
        margin-left:-10px;
        height: 0;
        border-bottom: 1px solid #fff;
        transform: rotate(7deg);

    }

    .l{
        position:relative;
        top:5px;
    }
    .r{
        position:relative;
        top:-5px;
    }
}

@media screen and (max-width:1200px){
    .duijiaoxian {
        &::before {
            transform: rotate(9deg);
        }
    }
}

@media screen and (max-width:768px){
    .duijiaoxian {
        &::before {
            transform: rotate(13deg);
        }
    }
}

@media screen and (max-width:500px){
    .duijiaoxian {
        &::before {
            transform: rotate(19deg);
        }
    }
}

.solutions .swiper,.agency .swiper{
    
    width:800px;
    max-width:100%;
    height: 400px;
    margin: 50px auto;

}
.slide-image {

    width: 100%;
    height: 100%;
    object-fit: cover;
    /*图片自适应容器，保持比例*/

}